<div id="black"><a href="/"><img src="/black.png"></a></div>
<div id="lay">
    <div><span>点击文件或者拖拽文件到图标上即可上传文件</span>
        <br/><span>只能上传“.md、jpg'、 'jpeg、png、 gif”类型的文件</span> 
    </div>
    <div class="txt-ts">
        <img src="/uploading.png">
        <input type="file" name="" id="upload">
    </div>
    
</div>

<script src="/js/jquery-3.6.0.min.js"></script>
<style>
    body {
        background-color: rgba(234, 205, 118, .4)
    }


    #lay {
        width: 300px;
        height: 300px;
        border: 2px dashed rgb(224, 199, 199);
        position: relative;
        margin: 100px;
        padding-top: 8px;
        
    }

    #upload {
        width: 110px;
        line-height: 130px;
        margin: 36px 10px;
        background-color: rosybrown;
        position: absolute;
        top: 0px;
        opacity: 0;
    }

    .txt-ts {
        width: 200px;
        line-height: 200px;
        position: absolute;
        top: 50px;
    }
    .text-ts img{
        position: absolute;
        top: 0px;
    }
</style>
<script>

    $('#upload').on('change', () => {
        let file = $('#upload')[0].files[0]
        if (!file) return;

        let formDate = new FormData()
        formDate.append('maeizje', file);
        $.ajax({
            url: file.type.includes('image') ? '/uploadImg' : '/upload',
            type: 'post',
            data: formDate,
            cache: false,//不必须
            processData: false,//必须
            contentType: false,//必须
            success: function (data) {
                alert(data.msg);

            }
        })
    })
</script>